<div class="filter">
    <div class="f1 item" style="width: 100px;">
        <input type="text" class="am-form-field" placeholder="起始日期" id="start"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f2 item" style="width: 100px;">
        <input type="text" class="am-form-field" placeholder="结束日期" id="end"
            data-am-datepicker="{theme:'success'}" readonly required />
    </div>
    <div class="f3 item" style="width: 100px;">
        <input type="text" class="am-form-field" placeholder="用户名" />
    </div>
    <div class="f5 item" style="width: 100px;">
        <select data-am-selected>
            <option value="-1">所有类型</option>
            <option value="deposit">充值</option>
            <option value="withdraw">出款</option>
            <option value="consume">下注</option>
            <option value="profit">盈利</option>
            <option value="reward">奖励</option>
            <option value="penalty">惩罚扣款</option>
            <option value="deduct">其他扣款</option>
            <option value="cancel">撤单</option>
            <option value="back">返水</option>
        </select>
    </div>

    <div class="f9 item">
        <select data-am-selected>
            <option value="-1">全部状态</option>
            <option value="0">新增</option>
            <option value="1">完成</option>
            <option value="2">拒绝</option>
        </select>
    </div>

    <div class="button item">
        <button type="button" class="am-btn am-btn-primary">查看</button>
    </div>

    <div class="f4 item" style="margin-left: 20px; color: red;">
        <label class="am-checkbox">
            <input type="checkbox" class="auto" value="" data-am-ucheck> 每8秒自动刷新
        </label>
    </div>

    <div class="clear"></div>
</div>

<table class="am-table am-table-bordered am-table-striped am-table-compact" id="result-table">
  <thead>
  <tr>
    <th width="100px">申请时间</th>
    <th width="100px">处理时间</th>
    <th width="100px">用户</th>
    <th width="60px">层级</th>
    <th width="100px">类型</th>
    <th width="60px">金额</th>
    <th width="70px">余额</th>
    <th>备注</th>
    <th width="100px">状态</th>
    <th width="100px">操作者</th>
  </tr>
  </thead>
  <tbody>
  </tbody>
</table>
<div class="zxf_pagediv"></div>
<style type="text/css">
    #result-table td {
        line-height: 20px;
        vertical-align: middle;
        padding: 8px 4px 8px 4px;
    }
</style>

<script>
    $(".f1 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f2 input").datepicker({format: 'yyyy-mm-dd'});
    $(".f1 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))
    $(".f2 input").datepicker("setValue", new Date().Format("yyyy-MM-dd"))
    Util.restorePageFilter();

    if (context.center.balanceOper == 'seeOne' && context.center.user) {
        $(".f3 input").val(context.center.user.mobile);
    }
    
    var _f = Util.queryTemplate($("#result-table tbody"), ".zxf_pagediv", $(".button button"), function(page, size, cb) {
        var data = {
            pageNum: page,
            pageSize: size,
            owner: "",
        };
        var v = $(".f1 input").val().trim();
        if (v) data.start = v;
        var v = $(".f2 input").val().trim();
        if (v) data.end = v;
        var v = $(".f9 select").val();
        if (v != -1) data.state = v;
        var v = $(".f3 input").val().trim();
        if (v) data.uid = v;
        var v = $(".f5 select").val().trim();
        if (v != -1) data.type = v;

        if (data.end && data.start && 
            new Date(data.end).getTime() - new Date(data.start).getTime() > 7 * 24 * 3600 * 1000) {
            alert2("查询的时间跨度，不能超过7天", true);
            return;
        }

        Util.savePageFilter([".f1 input", ".f2 input", ".f9 select", ".f3 input", ".f5 select"]);
        startLoading();
        CMD.query_account_log(data, function(r) {
            stopLoading();
            cb(r);
        });
    }, function(table, list, sum) {
        if (Util.isEmpty(list)) {
            table.append("<tr><td colspan='9'>暂无数据</tr>");
            return;
        }

        // sum
        var tr = $("<tr></tr>");
        tr.append("<td style='text-align:center;' colspan='5'>合计</td>");
        tr.append("<td style='text-align:center;'>" + sum/100 + "</td>");
        tr.append("<td colspan='4'></td>");
        table.append(tr);

        for (var i in list) {
            var d = list[i];
            var tr = $("<tr></tr>");
            tr.append("<td>" + d.start.substring(5) + "</td>");
            if (!d.end)
                tr.append("<td>--</td>");
            else
                tr.append("<td>" + d.end.substring(5) + "</td>");
            tr.append("<td class='name'>" + (d.user.mobile || '游客') + "</td>");
            var layer = Layer.config[d.user.layer + ""] || {};
            tr.append("<td>" + (layer.name || '') + "</td>");
            
            if (d.channel2)
                tr.append("<td>" + Util.convertLogType(d.type) + (d.channel2 ? "/" + Util.convertChannel(d.channel2) : '') + "</td>");
            else {
                var s = Util.convertLogType(d.type);
                if (d.channel) s += "/" + Util.convertChannel(d.channel);
                if (d.channel3) s += "/" + Util.convertChannel(d.channel3);
                tr.append("<td>" + s + "</td>");
            }
            tr.append("<td>" + (d.amount/100) + "</td>");
            tr.append("<td>" + (d.balance/100) + "</td>");
            var memo = Util.convertMemo(d);
            tr.append("<td class='l'>" + memo + "</td>");
            tr.append("<td>" + Util.drawBalanceLogState(d) + "</td>");
        
            if (!Util.isEmpty(d.manager)) {
                tr.append("<td>" + (d.manager.mobile || '') + "</td>");
            }
            else tr.append("<td> </td>");
            table.append(tr);
        }

        var arr = $("#result-table td.name");
        for (var i = 0; i < arr.length; i++) registerClickName($(arr[i]), $(arr[i]).html())

        Util.registerBalanceOper(list, table, function() { _f(); })
    });

    function registerClickName(td, uid) {
        td.dblclick(function() {
            show_user_detail(uid);
        });
    }
</script>
